<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<nav th:fragment="loginBodyHeader" class="navbar navbar-expand-md navbar-dark bg-dark py-0">
    <div class="container">
        <div class="navbar-nav me-auto mb-2 mb-md-0">
            <a class="nav-link active" href="/spending">
                <div class="navbar-brand"><img th:src="@{/images/icon-logo.png}" width="32"> Spending</div>
            </a>
            <a class="nav-link active fs-6 my-auto" th:href="@{/info}">Info</a>
        </div>
        <form class="row p-2" id="login_form" th:action="@{/login}" method="post">
            <div></div>
            <input class="col-4 me-2" type="text" placeholder="Email" name="username" id="username"
                   style="border-radius:5px">
            <input class="col-4 me-2" type="password" placeholder="Password" name="password" id="password"
                   style="border-radius:5px">
            <button class="btn btn-success col-1" type="submit" id="btnLogin">
                <!--                    onclick="usernameToLowerCase()">-->
                <img th:src="@{/images/icon-entrance.gif}" width="32">
            </button>
        </form>
    </div>
    <!--    <script type="text/javascript">-->
    <!--        function usernameToLowerCase() {-->
    <!--            let username = document.getElementById("username").value;-->
    <!--            document.getElementById("username").value = username.toLowerCase();-->
    <!--        }-->
    <!--    </script>-->
</nav>

</body>
</html>